<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link
      rel="stylesheet"
      href="https://at.alicdn.com/t/c/font_4987107_rd77gy6cmuj.css"
    />
    <link rel="stylesheet" href="./css/reset.css" />
    <style>
      .footer .wrap {
        font: 14px/1.5 Helvetica Neue, Helvetica, Arial, Microsoft Yahei,
          Hiragino Sans GB, Heiti SC, WenQuanYi Micro Hei, sans-serif;
      }
      .footer-service {
        width: 100%;
        height: 80px;
        padding: 38px 0;
        border-bottom: 1px solid #b0b0b0;
      }
      .footer-service li {
        float: left;
        width: 245.2px;
        height: 25px;
        line-height: 25px;
        text-align: center;
      }

      .footer-service li:not(:last-child) {
        border-right: 1px solid #b0b0b0;
      }

      .footer-service li a {
        position: relative;
        color: #616161;
      }
      .footer-service li:hover a {
        color: #ff6a00;
        position: relative;
      }
      .footer-service li a > i {
        display: inline-block;
        font-size: 24px;
        position: relative;
        top: 2px;
        margin-right: 4px;
      }

      .footer-link {
        width: 100%;
        padding: 40px 0 40px 160px;
      }

      .footer-link .footer-link-left ul {
        float: left;
        width: 160px;
        padding: 0 0 40px 0;
      }

      .footer-link .footer-link-left > ul > li {
        width: 160px;
        height: 20px;
        margin: 10px 0 0 0;
      }
      .footer-link .footer-link-left > ul > li > a {
        font-size: 12px;
        color: #757575;
      }
      .footer-link .footer-link-left > ul > li > a:hover {
        color: #ff6a00;
      }

      .footer-link .footer-link-left > ul > li:first-child {
        margin: 0 0 20px 0;
        color: #424242;
        font-size: 14px;
      }

      .footer-link .footer-link-right {
        width: 251px;
        float: right;
        color: #616161;
        text-align: center;
      }
      .footer-link .footer-link-right .phone-num {
        font-size: 22px;
        color: #ff6a00;
      }
      .footer-link .footer-link-right .work-time {
        font-size: 12px;
        margin: 0 0 5px;
      }
      .footer-link .footer-link-right .footer-r-top {
        margin-bottom: 30px;
        border-left: 1px solid #75757570;
      }
      .footer-link .footer-link-right button {
        border: 1px solid #ff6a00;
        width: 120px;
        height: 30px;
        background-color: #fff;
        color: #ff6700;
        cursor: pointer;
        font-size: 12px;
        margin-top: 5px;
        transition: all 0.3s;
      }
      .footer-link .footer-link-right button:hover {
        color: #fff;
        background-color: #ff6700;
      }

      .footer-link-right .footer-t-buttom > div {
        width: 200px;
        text-align: left;
        margin-left: 52px;
      }

      /* 版权区样式 */
      .site-info {
        width: 100%;
        height: 300px;
        background-color: #fafafa;
        clear: both;
        padding: 30px 0;
      }

      .logo-buttom {
        float: left;
        width: 56px;
        height: 56px;
      }

      .logo-buttom i {
        font-size: 56px;
        color: #ff6700;
      }

      .text-buttom {
        float: left;
        margin-left: 20px;
      }

      .text-buttom .site {
        height: 18px;
        line-height: 18px;
        font-size: 12px;
      }

      .text-buttom .site a,
      .text-buttom .site span {
        color: #757575;
      }

      .text-buttom .site a:hover {
        color: #ff6700;
      }
      .text-buttom p:last-child,
      .text-buttom p:last-child a {
        color: #b0b0b0;
      }
      .site-info .wrap .buttom-img {
        clear: both;
        height: 28px;
        margin: 4px 0 15px;
        padding-left: 76px;
        padding-top: 60px;
      }

      .buttom-img img {
        height: 28px;
      }

      .link_img_active {
        display: none;
      }

      .page-bottom-text{
        padding-top: 30px;
      }

      .page-bottom-text p{
       height: 80px;
        line-height: 80px;
        text-align: center;
        color: #75757570;
        font-size: 20px;
        font-family: "华文行楷";
      }
    </style>
  </head>
  <body>
    <div class="footer">
      <div class="wrap">
        <div class="footer-service">
          <ul>
            <li>
              <a href=""
                ><i class="iconfont icon-yijiuhuanxin"></i>
                <span>预约维修服务</span></a
              >
            </li>
            <li>
              <a href=""
                ><i class="iconfont icon-yijiuhuanxin"></i>
                <span>七天无理由退货</span></a
              >
            </li>
            <li>
              <a href=""
                ><i class="iconfont icon-yijiuhuanxin"></i>
                <span>15天免费换货</span></a
              >
            </li>
            <li>
              <a href=""
                ><i class="iconfont icon-yijiuhuanxin"></i>
                <span>满69包邮</span></a
              >
            </li>
            <li>
              <a href=""
                ><i class="iconfont icon-yijiuhuanxin"></i>
                <span>1100余家售后网点</span></a
              >
            </li>
          </ul>
        </div>
        <div class="footer-link">
          <div class="footer-link-left">
            <ul>
              <li>选购指南</li>
              <li><a href="#">手机</a></li>
              <li><a href="#">电视</a></li>
              <li><a href="#">笔记本</a></li>
            </ul>
            <ul>
              <li>服务中心</li>
              <li><a href="#">手机</a></li>
              <li><a href="#">电视</a></li>
              <li><a href="#">笔记本</a></li>
              <li><a href="#">可持续发展</a></li>
              <li><a href="#">可持续发展</a></li>
              <li><a href="#">可持续发展</a></li>
              <li><a href="#">可持续发展</a></li>
              <li><a href="#">可持续发展</a></li>
            </ul>
            <ul>
              <li>线下门店</li>
              <li><a href="#">手机</a></li>
              <li><a href="#">电视</a></li>
              <li><a href="#">小米之家</a></li>
            </ul>
            <ul>
              <li>关于小米</li>
              <li><a href="#">手机</a></li>
              <li><a href="#">电视</a></li>
              <li><a href="#">笔记本</a></li>
              <li><a href="#">申请售后</a></li>
            </ul>
            <ul>
              <li>关注我们</li>
              <li><a href="#">手机</a></li>
              <li><a href="#">电视</a></li>
              <li><a href="#">笔记本</a></li>
              <li><a href="#">新浪微博</a></li>
            </ul>
          </div>
          <div class="footer-link-right">
            <div class="footer-r-top">
              <p class="phone-num">400-100-578</p>
              <p class="work-time">8:00-18:00 (仅收市话费)</p>
              <button>
                <i class="iconfont icon-yijiuhuanxin"></i>人工客服
              </button>
            </div>
            <div class="footer-t-buttom">
              <p class="phone-num">400-100-578</p>
              <div>
                <p class="work-time">8:00-18:00 (仅收市话费)</p>
                <p class="work-time">适用于：MIX FOLD,巨屏显示器系列</p>
              </div>

              <button>
                <i class="iconfont icon-yijiuhuanxin"></i>人工客服
              </button>
            </div>
          </div>
        </div>
      </div>
    </div>

    <div class="site-info">
      <div class="wrap">
        <div>
          <div class="logo-buttom">
            <i class="iconfont icon-icon-xiaomiguishu"></i>
          </div>
          <div class="text-buttom">
            <p class="site">
              <a href="">小米商城</a>
              <span>|</span>
              <a href="">小米崇拜OS</a>
              <span>|</span>
              <a href="">米家</a>
              <span>|</span>
              <a href="">多看</a>
              <span>|</span>
              <a href="">游戏</a>
              <span>|</span>
              <a href="">音乐</a>
              <span>|</span>
              <a href="">政企服务</a>
              <span>|</span>
              <a href="">小米天猫店</a>
              <span>|</span>
              <a href="">小米集团隐私政策</a>
              <span>|</span>
              <a href="">小米公司儿童信息保护规则</a>
              <span>|</span>
              <a href="">小米商城隐私政策</a>
              <span>|</span>
              <a href="">小米商城用户协议</a>
              <span>|</span>
              <a href="">问题商城</a>
              <span>|</span>
              <a href="">Select Location</a>
            </p>

            <p class="site">
              <a href="#">北京互联网法院法律服务工作站</a>
              <span>|</span>
              <a href="#">中国消费者协会</a>
              <span>|</span>
              <a href="#">北京市消费者协会</a>
            </p>

            <p class="site">
              &copy;
              <a href="#">mi.com</a>
              <span>|</span>
              京ICP证110507号
              <a href="#">京ICP备10046444号-2</a>
              <a href="#">京公网安备11010802020134号</a>
              <a href="#">京网文[2014]0059-0009</a>
              <br />
              <a href="#">（京）网械平台备字（2018）第00005号</a>
              <a href="#"
                >药品医疗器械网络信息服务备案
                (京)网药械信息备字（2024）第00478号</a
              >

              <a href="#">营业执照</a>
              <a href="#">医疗器械质量公告</a>
              <br />

              <a href="#">增值电信业务经营许可证编号：京B2-20180851</a>
              网络食品经营备案 京食药网食备202010048
              <a href="#">食品经营许可证</a>
              新出发京批字第直220280号
              <br />
              违法和不良信息举报电话：171-5104-4404
              <a href="#">知识产权侵权投诉</a>
              本网站所列数据，除特殊说明，所有数据均出自我司实验室测试
            </p>
          </div>
        </div>
        <div class="buttom-img">
          <a href="#"><img src="./img/v-logo-1.png" alt="" /></a
          ><a href="#"><img src="./img/v-logo-2.png" alt="" /></a
          ><a href="#"><img src="./img/v-logo-3.png" alt="" /></a
          >
          <a href="#">
            <img class="link-img" src="./img/v-logo-4.png" alt="" />
            <img
              class="link-img link_img_active"
              src="./img/v-logo-5.png"
              alt=""
          /></a>
        </div>

        <div class="page-bottom-text">
          <p>让全球每个人都能享受科技带来的生活</p>
        </div>
      </div>
    </div>
    <script src="./footer.js"></script>
  </body>
</html>
